<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="UTF-8">
    <title>有道笔记</title>
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/bootstrap.min.css') }}">

    <script type="text/javascript" src="{{ url_for('static', filename='js/jquery.slim.min.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static', filename='js/bootstrap.min.js') }}"></script>
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalabel=no"/>
   <style>
        .row div {
            border: solid 0px red;
        }

        body {
            background-color: #eeeeee;
        }

        @media (min-width: 1300px) {
            .container {
                max-width: 1300px;
            }
        }

        .header {
            border-top: solid 3px black;
        }

        .menu {

            background: #0f6674;
        }

        .menu .menu-bar a:link {
            color: white;
        }

        .article-list .detail {
            padding: 0px 10px;
        }

        .article-list .thumb {
            margin: 0px;
            padding: 2px 10px 0 0;
        }

        .article-list .detail .title {
            font-size: 22px;
            color: #e56244;
            margin-bottom: 10px;
        }

        .article-list .detail .info {
            font-size: 14px;
            color: #666666;
            margin-bottom: 10px;
        }

        .article-list .detail .intro {
            font-size: 16px;
            word-break: break-all;
            word-wrap: break-word;
            line-height: 25px;
        }

        .search-bar {
            margin: 0px;
            border: solid 1px #cccccc;
            padding: 10px 0px;
            background-color: #0f6674;
        }

        .form-control {
            display: block;
            width: 100%;
            height: 34px;
            padding: 6px 12px;
            font-size: 14px;
            line-height: 1.42857143;
            color: #555;
            background-color: #fff;
            background-image: none;
            border: 1px solid #ccc;
            border-radius: 4px;
            -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
            box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
            -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
            -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
            transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        }
    </style>

</head>
<body>
<div class="header">
    <div class="container" style="height: 80px">
        <div class="row">
            <div class="col-5" style="padding-top: 10px">
                <img src="{{ url_for('static', filename='img/youdao.png') }}" width="230">
            </div>
            <div class="col-7 d-none d-sm-block" style="text-align: right;padding-top: 25px ">
                <h3>高效办公</h3>
            </div>
            <div class="col-7 d-sm-none " style="text-align: right;padding-top: 15px ">
                <h3>技术博客</h3>
            </div>

        </div>
    </div>

</div>

<div class="menu">
    <div class="container" style="padding: 0">
        <nav class="navbar navbar-expand-lg navbar-dark menu-bar" style="background-color: #0f6674">
            <a class="navbar-brand" href="#">快捷导航</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse"
                    data-target="#navbarSupportedContent"
                    aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <div class="navbar-nav">
                    <a class="nav-item nav-link" href="/tpye/1-1">python开发</a>
                    <a class="nav-item nav-link" href="/tpye/1-2">java开发</a>
                    <a class="nav-item nav-link" href="/tpye/1-3">测试开发</a>
                    <a class="nav-item nav-link" href="/tpye/1-4">前端学习</a>
                </div>
                <div class="navbar-nav ml-auto">
                    <a class="nav-item nav-link" href="#">登录</a>
                    <a class="nav-item nav-link" href="#">注册</a>
                    <a class="nav-item nav-link" href="#">用户中心</a>
                </div>
            </div>
        </nav>
    </div>
</div>

<div class="container" style="margin-top: 20px;">
    <div class="row">


        <div class="col-sm-9 col-12" style="padding: 0 10px;" id="left">
            <div class="col-12 article-detail row">
                <div class="col-9 title">
                    利用Python开发Monkey测试脚本（二）
                </div>
                <div class="col-3 favorite">
                    <label class="favorite-btn" onclick="addFavorite('365')">
                        <span class="oi oi-heart" aria-hidden="true"></span> 收藏本文
                    </label>
                </div>
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 info">
                    作者：强哥&nbsp;&nbsp;&nbsp;类别：Python开发&nbsp;&nbsp;&nbsp;
                    日期：2019-08-27 14:43:59&nbsp;&nbsp;&nbsp;
                    阅读：240 次&nbsp;&nbsp;&nbsp;消耗积分：0 分
                </div>
                <div class="col-12 content" id="content">


                    <div class="col-12 favorite" style="margin: 30px 0px;">
                        <!-- 只有文章作者可以编辑该文章 -->
                        &nbsp;&nbsp;&nbsp;
                        <!-- 收藏和取消收藏按钮 -->
                        <label class="favorite-btn" onclick="addFavorite('365')">
                            <span class="oi oi-heart" aria-hidden="true"></span> 收藏本文
                        </label>
                    </div>
                </div>

                <div class="col-12 article-nav">
                    <div>版权所有，转载本站文章请注明出处：蜗牛笔记， http://www.woniunote.com/article/365</div>
                    <div>上一篇：
                        <a href="/article/364">他说：请大家都来监督我！</a>
                    </div>
                    <div>下一篇：
                        <a href="/article/366">请注意：蜗牛学院第二届Java开发方向学员项目竞赛火热来袭~</a>
                    </div>
                </div>

                <div class="col-12 article-comment" id="commenttop">
                    <div class="col-12 row add-comment ">
                        <div class="col-sm-2 col-12">
                            <label for="nickname">你的昵称：</label>
                        </div>
                        <div class="col-sm-10 col-12" style="padding: 0 0 0 10px;">
                            <input type="text" class="form-control" id="nickname" value="你还未登录，双击此处可登录."
                                   ondblclick="showLogin()" readonly="">
                        </div>
                    </div>
                    <div class="col-12 row">
                        <div class="col-sm-2 col-12">
                            <label for="comment">你的评论：</label>
                        </div>
                        <div class="col-sm-10 col-12" style="padding: 0 0 0 10px;">
                        <textarea id="comment" class="form-control" placeholder="请在此留下你的真诚的、感人的、发自肺腑的赞美之词."
                                  style="height: 100px;"></textarea>
                            <!--<script id="comment" name="comment" type="text/plain"></script>-->
                        </div>
                    </div>
                    <div class="col-12 row" style="margin-bottom: 20px;">
                        <div class="col-2"></div>
                        <div class="col-sm-8 col-12" style="text-align: left; color: #888888;">提示：登录后添加有效评论可享受积分哦！</div>
                        <div class="col-sm-2 col-12" style="text-align: right">
                            <button type="button" class="btn btn-primary" onclick="showLogin()">点此登录</button>
                        </div>
                    </div>

                    <div id="commentDiv">
                        <!-- 循环遍历评论，这部分代码保持不变 -->
                    </div>

                </div>
                <!-- 由于使用Ajax进行分页，分页导航时不能再使用超链接 -->
            </div>
        </div>


        <!-- 侧栏文章推荐 -->

        <div class="col-sm-3 col-12" style="border: none;padding-right: 10px;padding-top: 15px">
            <div class="col-12 search-bar row ">
                <input type="text" style="margin-left: 10px" id="keyword" placeholder="请输入关键字">
                <div class="col-4">
                    <button type="button" class="btn btn-primary">搜索</button>
                </div>
            </div>



            <!-- 利用前端JS进行渲染 -->
            <div class="col-12 side">
                <div class="tip">最新文章</div>
                <ul id="last">
                    <li><a href="/article/609">1.&nbsp;&nbsp;10月24日，蜗牛学院第五届程序员...</a></li>
                    <li><a href="/article/608">2.&nbsp;&nbsp;培训期间，从未12点之前离开过教...</a></li>
                    <li><a href="/article/607">3.&nbsp;&nbsp;核心实验：利用UIAutomation库测...</a></li>
                    <li><a href="/article/606">4.&nbsp;&nbsp;报告：阿多比学员出关了！...</a></li>
                    <li><a href="/article/605">5.&nbsp;&nbsp;揭秘：带你了解学员眼中真实的阿...</a></li>
                    <li><a href="/article/604">6.&nbsp;&nbsp;通过对合作企业的回访，我们发现...</a></li>
                    <li><a href="/article/603">7.&nbsp;&nbsp;从会计转行Java开发，她的入职月...</a></li>
                    <li><a href="/article/602">8.&nbsp;&nbsp;蜗牛出版之《自动化测试开发全程...</a></li>
                    <li><a href="/article/601">9.&nbsp;&nbsp;核心实验：利用UISpy识别Window...</a></li>
                </ul>
            </div>

            <div class="col-12 side">
                <div class="tip">最多阅读</div>
                <ul id="most">
                    <li><a href="/article/466">1.&nbsp;&nbsp;强哥聊：IT行业激荡30年-&gt;技术改...</a></li>
                    <li><a href="/article/4">2.&nbsp;&nbsp;JS+定时器实现在线时钟...</a></li>
                    <li><a href="/article/498">3.&nbsp;&nbsp;这五点告诉你，阿多比设计学院，...</a></li>
                    <li><a href="/article/497">4.&nbsp;&nbsp;全国人均工资单出炉，IT行业年平...</a></li>
                    <li><a href="/article/468">5.&nbsp;&nbsp;强哥聊：IT行业的35岁，一道难以...</a></li>
                    <li><a href="/article/491">6.&nbsp;&nbsp;蜗牛学院PBET-7.0课程体系重磅发...</a></li>
                    <li><a href="/article/131">7.&nbsp;&nbsp;图像识别在游戏自动化测试中的应...</a></li>
                    <li><a href="/article/493">8.&nbsp;&nbsp;预备知识：软件测试专业术语...</a></li>
                    <li><a href="/article/495">9.&nbsp;&nbsp;面试绕不过的闭包...</a></li>
                </ul>
            </div>


        </div>
    </div>


</div>


<div class="container-fluid footer">
    <div class="container">
        <div class="row">
            <div class="col-4 left">
                <p>版权所有 © 蜗牛笔记 (V-1.0)</p>
                <p>备案号： 蜀ICP备15014130号</p>
            </div>
            <div class="col-4 center">
                <p>友情链接</p>
                <p><a href="http://www.woniuxy.com/" target="_blank">在线课堂</a>&nbsp;&nbsp;&nbsp;
                    <a href="http://www.woniuxy.com/live" target="_blank">直播课堂</a>&nbsp;&nbsp;&nbsp;
                    <a href="http://www.woniuxy.com/train/index.html" target="_blank">培训中心</a>&nbsp;&nbsp;&nbsp;
                    <a href="http://www.aduobi.com" target="_blank">UI设计学院</a>
                </p>
            </div>
            <div class="col-4 right">
                <p>联系我们</p>
                <p>成都★孵化园&nbsp;&nbsp;&nbsp;QQ/微信：15903523</p>
            </div>
        </div>
    </div>
</div>
</body>
</html>